<template>
	<view class="orderType">
		<view class="list">
			<view class="">
				接单类型
			</view>
			<view class="aa">
				<view class="dan">
					<view class="" style="padding-right: 4px;color: rgb(153,153,153);    padding-left: 30rpx;">
						实时单
					</view>
					<u-checkbox-group>
						<u-checkbox v-model="checked" shape="circle"></u-checkbox>
					</u-checkbox-group>
				</view>
				<view class="dan" style="    margin-left: 7%;">
					<view class="" style="padding-right: 4px;color: rgb(153,153,153);    padding-left: 30rpx;">
						预约单
					</view>
					<u-checkbox-group>
						<u-checkbox v-model="checked1" shape="circle"></u-checkbox>
					</u-checkbox-group>
				</view>
			</view>
		</view>
		<view class="list">
			<view class="">
				订单实时通知
			</view>
			<u-switch v-model="checked2"></u-switch>
		</view>
		<view class="list">
			<view class="">
				实时共享位置打开
			</view>
			<u-switch v-model="checked3"></u-switch>
		</view>
		<view class="list">
			<view class="">
				来单弹窗通知
			</view>
			<u-switch v-model="checked4"></u-switch>
		</view>
		<view class="list">
			<view class="">
				抢单跳转页面
			</view>
			<u-switch v-model="checked5"></u-switch>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				checked: "",
				checked1: "",
				checked2: false,
				checked3: false,
				checked4: false,
				checked5: true,
			}
		},
		methods: {
			change(status) {
				// console.log(status);
			},
		}
	}
</script>

<style scoped>
	.orderType {
		background: rgb(238, 238, 238);
		height: 1250rpx;
	}

	.list {
		display: flex;
		flex-direction: row;
		background: #FFFFFF;
		padding: 20rpx;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 1px;
	}

	.aa {
		display: flex;
		flex-direction: row;
		width: 60%;
	}

	.dan {
		width: 50%;
		height: 70rpx;
		border: 1px solid rgb(238, 238, 238);
		display: flex;
		flex-direction: row;
		align-items: center;
		border-radius: 10rpx;
	}
</style>
